﻿@{
    ViewBag.Title = "PostProblem";
}

@{
    Layout = "~/Shared/_layoutPostProblem.cshtml";
    var PageTitle = "Post Problem";
}

@section title
{
    @PageTitle
}

<script src="/Scripts/jquery-1.8.2.js" type="text/javascript"></script>
<script src="/Scripts/jquery-ui.js" type="text/javascript"></script>
<link rel="stylesheet" href="/Styles/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="~/Styles/template.css" media="screen">
<link href="../../Styles/jquery.ambiance.css" rel="stylesheet" type="text/css" />
<script src="../../Scripts/jquery.ambiance.js" type="text/javascript"></script>


<script type="text/javascript">

    function Post() {
        $.ambiance({
            message: "Your Problem is Posted successfully!",
            title: "Success!",
            type: "success"
        });
    }

    function Edit() {

         window.location = "/DiscussionPanel/PostProblem"
        
        $.ambiance({
            message: "Edit Problem",
            title: "Updation!",
            type: "success"
        });
    }
    
    $(document).ready(function () {
        $("#selectOpt").change(function () {
            var text = $("#selectOpt option:selected").text();
            if ($("#selectOpt option:selected").val() == "Other") {
                window.location = "/DiscussionPanel/AddProblemTag"
            }

        });
    });

</script>

@using (Html.BeginForm("PostProblem", "DiscussionPanel", FormMethod.Post, new { @class = "background" }))
{
      <br/><div id="content"><h2 style="text-align: center;margin-bottom: -36px;"><b>Post Problem</b></h2><br/></div>
    
           <table style="margin-left: 50px;" >
                 <tbody >
                    <tr>
                        <td >
                            Title:
                        </td>
                        <td >
                            <input type = "text" id ="title" />
                            <br/>
                        </td>
                    </tr>

                    <tr>
                        <td>
                            Problem:
                        </td>

                        <td >
                           <textarea rows = "7" cols ="40"></textarea>
                            <br/>   
                        </td>
                    </tr>
                    
                    <tr>
                        <td >
                            Problem Tag:
                        </td>
                         <td>
                            <select name="SelectOption" id="selectOpt" ONCHANGE="location = this.options[this.selectedIndex].value;">
                                <option>-Select-</option>
                                <option>Java/option>
                                <option>C#</option>
                                <option>C++</option>
                                <option>Android</option>
                                <option>Other</option>
                            </select>
                        </td>
                    </tr>           
                    
        </tbody>
        </table>
    <div>                 
         <br/><input type="button" value="Post"  class ="buttonSave" style="margin-left: 152px;" onclick="Post()" />
         <input type="button" value="Edit" class ="buttonCancel" onclick="Edit()" />
  </div>

}